import * as React from 'react'
import * as ReactSwipe from 'react-swipe'

interface Props {
  sliders:string[],
  changeSelectedIndex:any
}
 

 
class SwiperItems extends React.Component
<Props> 
{
  // state = { :  }
  render() { 
    let {sliders} = this.props
    let swipeOptions={ continuous: true ,
    auto:1000,
    callback:(index)=>{
      this.props.changeSelectedIndex(index)
    }}
    console.log(sliders)
    return ( 
      sliders.length > 0 &&
      (<ReactSwipe
      className="carousel"
      swipeOptions={swipeOptions}
      > 
        {
          sliders.map((item:string,index:number)=>(
            <div key={index}>
              <img style={{width:'100%',height:'200px'}} src={item} alt=""/>
            </div>
          ))
        }
        
      </ReactSwipe>)
      
    )
  }
}
 
export default SwiperItems